<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ page language="java" contentType="text/html; charset=utf-8" 
import="java.util.*"
pageEncoding="utf-8"%>

<% String appName = request.getContextPath(); %>
<html >
<head>
 <meta charset="UTF-8">
<meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>角色管理</title>
</head>
<link rel="stylesheet" type="text/css" href="<%=appName %>/js/themes/metro-orange/easyui.css">
<script type="text/javascript" src="<%=appName %>/js/jquery.min.js"></script>
<script type="text/javascript" src="<%=appName %>/js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="<%=appName %>/js/jquery.edatagrid.js"></script>
<link rel="stylesheet" type="text/css" href="<%=appName %>/js/themes/icon.css">
<body >
<div style="width:1600px;margin:100px auto">
    <div style="font-size:200%;text-align:center;">角色管理</div>

    <table id="task-list" title="角色管理" style="width:1450px;height:700px"
            data-options="rownumbers:true,
            singleSelect:true,
            url:'<%=appName%>/mvc/security/getRoles',
            method:'get',
            onLoadError : loadErr,
            loadFilter : loadFilter,
            updateUrl:'<%=appName%>/mvc/security/modifyRole',
            saveUrl:'<%=appName%>/mvc/security/modifyRole',
            destroyUrl:'<%=appName%>/mvc/security/delRole',
            autoSave:true,
            onSuccess:onSuccess,
            onDestroy:onDestory,
            onRowContextMenu: showMenu,
            toolbar:'#tb'">
        <thead>
            <tr>
                <th data-options="field:'ROLENAME',width:150,editor:{type:'textbox',options:{required:true, missingMessage:'角色名必填!'}}">角色名</th>
                <th data-options="field:'ROLEDESC',width:350,editor:{type:'textbox'}">描述</th>
                <th data-options="field:'PERMISSIONID',width:150,formatter:permissionFormatter, editor: { type: 'combobox', options: { url:'<%=appName%>/mvc/security/getPermissionsSimple', valueField: 'ID', textField: 'PERMISSION',multiple:true } }">拥有权限</th>
                <th data-options="field:'CREATEDT',width:180,align:'center'">创建时间</th>
                <th data-options="field:'CREATOR',width:180,align:'center'">创建者</th>
                <th data-options="field:'LASTUPDATE',width:180,align:'center'">最后修改时间</th>
            </tr>
        </thead>
    </table>
    <div id="tb" style="padding:2px 5px;">
        <a href="#" class="easyui-linkbutton" iconCls="icon-reload" onclick="refresh()" style="float:right;margin-right:20px">刷新</a>
    </div>
    <div id="mm" class="easyui-menu" style="width:120px;">
        <div onclick="addRow()" data-options="iconCls:'icon-add'">新增</div>
        <div onclick="editRow()" data-options="iconCls:'icon-edit'">编辑</div>
        <div class="menu-sep"></div>
        <div onclick="delRow()" data-options="iconCls:'icon-cancel'">删除</div>
        <div class="menu-sep"></div>
        <div onclick="refresh()" data-options="iconCls:'icon-reload'">刷新</div>
    </div>
 </div>
 <script type="text/javascript">

var clickedRow = undefined;
$(function(){
    $('#task-list').edatagrid({
    });
});

function onDestory(index,row){
    $.messager.show({
        //title:'数据刷新完成',
        msg:row.ROLENAME + ' 成功删除.',
        timeout:5000,
        showType:'slide'
    });
}

function onSuccess(index,row){
    var msg = JSON.parse(row.msg);
    if(msg.code == '0'){
        $.messager.show({
            //title:'数据刷新完成',
            msg:row.ROLENAME + ' 成功保存.',
            timeout:5000,
            showType:'slide'
        });
        row.ID=msg.returnData.ID;
        row.ROLENAME=msg.returnData.ROLENAME;
        row.ROLEDESC=msg.returnData.ROLEDESC;
        row.PERMISSIONID=msg.returnData.PERMISSIONID;
        row.PERMISSIONS=msg.returnData.PERMISSIONS;
        row.CREATEDT=msg.returnData.CREATEDT;
        row.CREATOR=msg.returnData.CREATOR;
        row.LASTUPDATE=msg.returnData.LASTUPDATE;
        $('#task-list').datagrid('refreshRow',index);
        
    }else{
        $.messager.alert('Warning',msg.msg);
    }
}
 function showMenu(e,index,row){
    clickedRow = index;
    if(index == -1 ) return;
        e.preventDefault();
        $('#mm').menu('show', {
            left: e.pageX,
            top: e.pageY
        });
    }
 
 function delRow(){
     $('#task-list').edatagrid('destroyRow', clickedRow)
}
 function addRow(){
     if(clickedRow == -1){
         $('#task-list').edatagrid('addRow', clickedRow + 1);
     }
     $('#task-list').edatagrid('addRow')
 }
function refresh(){
	$('#task-list').datagrid('reload');
}
function loadFilter(data){
    if(data.code == '0') {
        $.messager.show({
            //title:'数据刷新完成',
            msg:'数据刷新完成.',
            timeout:5000,
            showType:'slide'
        });
        return data.data;
    }
    $.messager.alert('错误',data.message,'error');
    return null;
}

function permissionFormatter(value,row){
    return row.PERMISSIONS;
}


function loadErr(){
    $.messager.alert('错误',"loaderr",'error');
}
</script>
</body>

</html>